<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    
    <script>
        const person = {
            name: "jack",
            age: 21,
            language: ['java', 'js', 'css']
        }

        // keys(obj)：获取对象的所有 key 形成的数组
        console.log(Object.keys(person)); // ["name", "age", "language"]
        // values(obj)：获取对象的所有 value 形成的数组
        console.log(Object.values(person)); // ["jack", 21, Array(3)]
        // entries(obj)：获取对象的所有 key 和 value 形成的二维数组
        console.log(Object.entries(person)); // [Array(2), Array(2), Array(2)]

        const target = { a: 1 };
        const source1 = { b: 2 };
        const source2 = { c: 3 };
        // Object.assign 方法的第一个参数是目标对象，后面的参数都是源对象。
        // assign(dest, ...src) ：将多个 src 对象的值 拷贝到 dest 中
        Object.assign(target, source1, source2);
        console.log(target) // {a: 1, b: 2, c: 3}

        const age = 23
        const name = "张三"

        // 传统
        const person1 = { age: age, name: name }
        console.log(person1)
        // ES6：属性名和属性值变量名一样，可以省略
        const person2 = { age, name }
        console.log(person2) // {age: 23, name: "张三"}

        let person = {
            name: "jack",
            // 以前：
            eat: function (food) {
                console.log(this.name + "在吃" + food);
            },
            // 箭头函数版：这里拿不到 this
            eat2: food => console.log(person.name + "在吃" + food),
            // 简写版：
            eat3(food) {
                console.log(this.name + "在吃" + food);
            }
        }
        person.eat("apple");

        // 拓展运算符（...）用于取出参数对象所有可遍历属性然后拷贝到当前对象。
        // 1、拷贝对象（深拷贝）
        let person1 = { name: "Amy", age: 15 }
        let someone = { ...person1 }
        console.log(someone) //{name: "Amy", age: 15}
        // 2、合并对象
        let age = { age: 15 }
        let name = { name: "Amy" }
        let person2 = { ...age, ...name } //如果两个对象的字段名重复，后面对象字段值会覆盖前面对象的字段值
        console.log(person2) //{age: 15, name: "Amy"}

        
    </script>

</body>
</html>